
<!DOCTYPE html>
<html lang="en" xmlns:th="https://www.thymeleaf.org">
<div th:replace="common/common::html"></div>
<head>
    <meta charset="UTF-8">
    <title th:text="#{login.title}"></title>
    <script th:inline="javascript">


        $(function () {
            $("#register").click(function (e) {
                $.ajax({
                    cache:true,
                    type : "post",
                    url :  /*[[@{addUserInfo}]]*/'',

                    data : $("#registerForm").serialize(),
                    async:false,
                    success: function (data) {
                        var obj = JSON.parse(data);
                        if(obj.success){
                            window.parent.location.href =  /*[[@{login}]]*/'';
                        }else{
                            message(obj.msg);
                        }

                    },
                    error: function(msg){
                        message(msg.responseText);
                    }

                })

            })
        });
    </script>
</head>
<body style="display: flex;flex-direction: column">
<div style="flex-basis: 100px;display: flex;flex-direction: row">
    <div style="flex-grow: 1;">
        <img th:if="${session.siteLanguage} eq 'en'" th:src="@{/assets/images/logo_en.png}">
        <img th:if="${session.siteLanguage} ne 'en'" th:src="@{/assets/images/logo_zh.png}">

    </div>
    <div style="flex-basis: 100px;margin-top: 26px;">
        <a th:href="@{login(siteLanguage=zh)}" th:text="#{login.chinese}"></a>
        <a th:href="@{login(siteLanguage=en)}" th:text="#{login.english}"></a>
    </div>
</div>
<div style="flex-grow: 1;display: flex;flex-direction: row">
    <img style="flex-grow: 1;" th:src="@{/assets/images/pic.png}">
    <div style="flex-basis: 320px;display: flex;flex-direction: column;margin-right: 20px;">
        <div style="flex-grow: 1;"></div>
        <div  style="flex-basis: 300px">
            <form id="registerForm"  method="post">
                <div class="form-group">
                    <span th:text="#{user.name}"></span>
                    <input class="form-control" type="text" name="userName" >
                </div>
                <div class="form-group">
                    <span th:text="#{user.password}"></span>
                    <input class="form-control" type="password" name="password" >
                </div>
                <div class="form-group">
                    <span th:text="#{user.email}"></span>
                    <input class="form-control" type="text" name="email" >
                </div>
                <div class="form-group">
                    <span th:text="#{user.mobile}"></span>
                    <input class="form-control" type="text" name="mobile" >
                </div>
                <div class="form-group">
                    <span th:text="#{user.nickname}"></span>
                    <input class="form-control" type="text" name="niceName" >
                </div>

                <div class="form-group">
                    <!--  <button type="submit" th:text="#{login.user.btn}"></button>-->
                    <a id="register" class="form-control btn-success"  type="button"  style="text-align: center" th:text="#{register.user.btn}"></a>

                </div>

            </form>
        </div>

        <div style="flex-grow: 2;"></div>
    </div>

</div>




</body>
</html>